<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--引用jquery-->
    <script type="text/javascript" src="./jquery/jquery-1.12.4.min.js"></script>

    <script type="text/javascript" src="./jquery/demo2.js"></script>

    <!--这段代码放在上面，那么js代码从上到下执行，找不到#box1元素，就无法往下执行甚至报错-->
    <!--解决方法：window.onload 给窗口添加一个事件，等待页面加载完毕以后，才会执行函数-->

    <script type="text/javascript">
        // 原生js写法
        // window.onload = function () {
        //     // $代表的就是jquery，这是基本语法
        // var b1 = $('#box1');
        // console.log(b1.text())
        // };

        // // jquery写法
        // $(function () {
        //     var b1 = $('#box1');
        //     console.log(b1.text())
        // });


    </script>

</head>
<body>


<div class="box1" name="box">box111</div>
<div class="box2">box2</div>
<a href="https://www.baidu.com">百度</a>

<div class="cs"><p>p标签</p></div>
<div class="cs"><a href="https://www.baidu.com">百度</a></div>


<ul>
    <li >111</li>
    <li>222</li>
    <li id="musen"><span>span001</span>333</li>
    <li>444</li>
    <li>555</li>
</ul>

<script type="text/javascript">
    // $代表的就是jquery，这是基本语法
    // var b1 = $('#box1');
    // console.log(b1.text())

</script>
</body>
</html>